//
//  OverlayDemo.swift
//  firstFontAttrDemo
//
//  Created by liy on 2025/1/20.
//

import SwiftUI

struct OverlayDemo: View {
  var body: some View {
    VStack {
      Rectangle()
        .fill(.orange)
        .frame(width: 300, height: 300)
        // 1.颜色
        .overlay(.blue)
        .overlay(LinearGradient(colors: [.red, .orange], startPoint: .leading, endPoint: .trailing))
        // 2.材料
        .overlay(.thinMaterial)
        // 3.视图
        .overlay {
          Text("hello")
						.font(.largeTitle)
        }
        //	4.形状
				.overlay (alignment: .bottomTrailing){
          Circle()
            .frame(width: 20, height: 20)
        }

      //			小案例:喜欢+20
      VStack {
        Image(systemName: "heart")
          .font(.largeTitle)
          .padding() // 内边距
          .foregroundStyle(.white) // 颜色
          .background {
            Circle()
              .fill(.red)
          }
          .shadow(radius: 5)
          .overlay(alignment: .bottomTrailing) {
            Circle()
              .fill(.teal)
              .frame(width: 20, height: 20)
          }
          .overlay(alignment: .bottomTrailing) {
            Text("20")
              .foregroundStyle(.white)
              .font(.caption)
              .frame(width: 20, height: 20)
          }
      }
    }
  }
}

#Preview {
  OverlayDemo()
}
